<script setup>
import { useRouter } from 'vue-router';
import Header0 from '../components/Header0.vue'
import MainSearchInput from '../components/MainSearchInput.vue'
import Search from './SearchPage.vue';
import NewQuestionnaire from '../components/NewQuestionnaire/index.vue'
import NewsItemsPage from './NewsItemsPage.vue'
import UesrPage from './UserPage.vue'
import QuestionPage from './QuestionPage.vue'
</script>


<template>

  <!-- <div class="common-layout">
        <el-container>
            <el-header>
                <header0 />
            </el-header>
            <el-main style="padding-top: 0px;">
                <component :is=currentTab></component>
            </el-main>
        </el-container>
    </div> -->

  <div class="common-layout">

    <el-container>
      <el-header>
        <header0 :goToNewQuestionnaire="goToNewQuestionnaire" :goToSearch="goToSearch"
          :goToNewsItemsPage="goToNewsItemsPage" :goToUesrPage="goToUesrPage" :goToQuestionPage="goToQuestionPage"
          :userName="userinformation.username">
        </header0>
      </el-header>
      <component :is="currentTab" :userAccount="userAccount"></component>
    </el-container>

  </div>


</template>

<script>
export default {
  data() {
    return {
      currentTab: Search,
      tabs: ['Search', 'NewQuestionnaire', 'NewsItemsPage', 'UesrPage', 'QuestionPage'],
      userAccount: '',
      userinformation: {
        username: 'error', // 使用 props 中的 userAccount 初始化 username
        userpassword: "123",
        sex: '男',
        birthday: '2004-04-29',
        work: '123',
        intro: '123',
        phone: '123',
      },
    }

  },

  mounted() {
    console.log(this.$router.currentRoute.value.params.userid);
    this.userAccount = this.$router.currentRoute.value.params.userid;
    this.$axios.post('/index.php/User/getAllUserInfor', { 'username': this.userAccount })
      .then(response => {
        // 处理成功的响应
        if (response.data.status) {
          console.log(response.data.data);
        }
        this.userinformation = response.data.data;
        this.userinformation.phone = response.data.data.id;
        console.log(this.userinformation);
        // this.handleLogin(response.data.status); // 根据需要进行进一步处理
      })
      .catch(error => {
        // 处理错误
        console.error('There was an error!', error);
        this.Alert = 'Error: ' + error.message;
      });
  },
  methods: {
    goToNewQuestionnaire(e) {
      this.currentTab = NewQuestionnaire;
    },

    goToSearch(e) {
      this.currentTab = Search;
    },
    goToNewsItemsPage(e) {
      this.currentTab = NewsItemsPage;
    },
    goToUesrPage(e) {
      this.currentTab = UesrPage;
    },
    goToQuestionPage(e) {
      this.currentTab = QuestionPage;
    }

  }
}

</script>

<style scoped>
/* 添加样式 */
.element-center {
  display: flex;
  justify-content: center;
}
</style>
